import React, { useState, useEffect } from 'react'
import { Table, Button, notification } from 'antd'
import { getNews, updateNewsInfo } from '@api'

export default function Audit() {
  /*--------------------------------------state--------------------------------------------------------------------------*/
  /*--------------------------------------state--------------------------------------------------------------------------*/
  /*--------------------------------------state--------------------------------------------------------------------------*/
  /*--------------------------------------state--------------------------------------------------------------------------*/
  const columns = [
    {
      title: '新闻标题',
      dataIndex: 'title',
      render: (title, item) => {
        return <a href={`#/news-manage/preview/${item.id}`}>{title}</a>
      }
    },
    {
      title: '作者',
      dataIndex: 'author'
    },
    {
      title: "新闻分类",
      dataIndex: 'category',
      render: (category) => {
        return <div>{category.title}</div>
      }
    },
    {
      title: "操作",
      render: (item) => {
        return <div>
          <Button type="primary" onClick={() => handleAudit(item, 2, 1)}>通过</Button>
          <Button danger onClick={() => handleAudit(item, 3, 0)}>驳回</Button>
        </div>
      }
    }
  ]
  const [dataSource, setdataSource] = useState([])
  const { roleId, region, username } = JSON.parse(localStorage.getItem("token"))
  const roleObj = {
    "1": "superadmin",
    "2": "admin",
    "3": "editor"
  }
  /*--------------------------------------useEffect--------------------------------------------------------------------------*/
  /*--------------------------------------useEffect--------------------------------------------------------------------------*/
  /*--------------------------------------useEffect--------------------------------------------------------------------------*/
  /*--------------------------------------useEffect--------------------------------------------------------------------------*/
  useEffect(() => {
    get_await_audit_news()
  }, [])
  /*--------------------------------------方法--------------------------------------------------------------------------*/
  /*--------------------------------------方法--------------------------------------------------------------------------*/
  /*--------------------------------------方法--------------------------------------------------------------------------*/
  /*--------------------------------------方法--------------------------------------------------------------------------*/
  // 获取待审核
  const get_await_audit_news = () => {
    getNews({
      auditState: 1,
      _expand: 'category'
    }).then((res) => {
      const list = res.data
      setdataSource(roleObj[roleId] === "superadmin" ? list : [
        ...list.filter(item => item.author === username),
        ...list.filter(item => item.region === region && roleObj[item.roleId] === "editor")
      ])
    })
  }

  const handleAudit = (item, auditState, publishState) => {
    setdataSource(dataSource.filter(data => data.id !== item.id))
    updateNewsInfo({
      id: item.id,
      auditState,
      publishState
    }).then( () => {
      notification.info({
        message: `通知`,
        description: `您可以到[审核管理/审核列表]中查看您的新闻的审核状态`,
        placement: "bottomRight"
      });
    })
  }
  /*--------------------------------------jsx--------------------------------------------------------------------------*/
  /*--------------------------------------jsx--------------------------------------------------------------------------*/
  /*--------------------------------------jsx--------------------------------------------------------------------------*/
  /*--------------------------------------jsx--------------------------------------------------------------------------*/
  return (
    <div>
      <Table dataSource={dataSource} columns={columns} pagination={{ pageSize: 5 }} rowKey={item => item.id} />
    </div>
  )
}
